<template>
  <div>
    <!-- 每一个内容 -->
    <div v-for="item in arr" :key="item.id" class="asdas" @click="jraaa(item)">
      <!-- 标题 -->
      <div class="biaoti">
        <span>{{
          item.title.length > 62 ? item.title.slice(0, 62) + "..." : item.title
        }}</span>
      </div>
      <!--时间 -->
      <div>
        <span>{{ item.createTime || "2023/6/11" }}</span>
      </div>
    </div>
     <!-- 把底部看不见的地方占住 -->
    <div style="height: 60px" />
  </div>
</template>

<script>
import axios from "axios";
export default {
  name: "DianTai",
  data() {
    return {
      arr: [],
    };
  },
  methods:{
    jraaa(item){
      this.$router.push({
        name:'contentdetails',
        params:{
          content:item
        }
      })
    }
  },
  mounted() {
    axios
      .get("http://localhost:8080/broadcasting/broadcastingll")
      .then((res) => {
        this.arr = res.data.data;
      });
  },
};
</script>

<style scoped>
.asdas {
  width: calc(100% - 20px);
  max-height: 110px;
  background-color: rgba(240, 238, 238, 0.726);
  margin: 20px 10px;
  font-size: 18px;
  display: flex;
  flex-direction: column;
  border-bottom: 1px black solid;
  font-weight: 600;
  border-radius: 10px;
}

.asdas > div {
  margin: 5px 5px;
}

</style>